<style lang="scss">
.z-hover-img {
  > img {
    display: none;
    &:first-child {
      display: block;
    }
  }
  :hover {
    > img {
      display: block;
      &:first-child {
        display: none;
      }
    }
  }
}
</style>

<template>
  <div class="z-hover-img">
    <img :src="p1">
    <img :src="p2">
  </div>
</template>

<script>
export default {
  name: "ZHoverImg",
  props: [
      'p1',
      'p2'
  ]
}
</script>
